Ext.form.ArrivalList = Ext.extend(Ext.List, {
    singleSelect: true,
    emptyText: 'No results.',
    isLoaded: false,
    scroll: false,

    initComponent: function () {

        Ext.regModel('Arrivals', {
            fields: [
            { name: 'RouteName', type: 'string' },
            { name: 'DestinationName', type: 'string' },
            { name: 'ArrivalTime', type: 'string' },            
	    ]
        });


        var store = new Ext.data.Store({
            model: 'Arrivals'
        });

        this.store = store;

        this.tpl = new Ext.XTemplate(
        [
            '<div style = "margin: 0px 20px 0px 20px;" >',
                '<tpl for=".">',
                    '<div>',
                        '<div style="float: left; width: 10%;">',
                            '{RouteName}',
                        '</div>',
                        '<div style="float: left; width: 20%;">',
                            '{DestinationName}',
                        '</div>',
                        '<div>',
                            '{ArrivalTime}',
                        '</div>',
                        '<hr/>',
                    '</div>',                    
                '</tpl>',
            '</div>',
        ]
        );

        Ext.form.ArrivalList.superclass.initComponent.call(this);
    }
});

Ext.reg('arrivallist', Ext.form.ArrivalList);